<template>
  <div class="pdf-box">
    <iframe :src="pdfUrl" width="100%" height="100%"></iframe>
  </div>
</template>
<script>
  import request from '@/router/axios'
  export default {
    data(){
      return {
        bucketName:'',
        filename:'',
        pdfUrl: '',
      }
    },
    created() {
      this.bucketName = this.$route.query.bucketName
      this.filename = this.$route.query.filename
    },
    mounted() {
      this.view()
    },
    methods:{
      view: function() {
        request({
          url: '/admin/sys-file/fileView/' + this.bucketName + '/' + this.filename,
          method: 'get',
          responseType: 'blob'
        }).then((response) => { // 处理返回的文件流
          const blob = response.data
          let url="";
          if (window.createObjectURL != undefined) { // basic
            url = window.createObjectURL(blob);
          } else if (window.webkitURL != undefined) { // webkit or chrome
            try {
              url = window.webkitURL.createObjectURL(blob);
            } catch (error) {}
          } else if (window.URL != undefined) { // mozilla(firefox)
            try {
              url = window.URL.createObjectURL(blob);
            } catch (error) {}
          }
          this.pdfUrl = `${process.env.BASE_URL}pdf/web/viewer.html?file=${encodeURIComponent(url)}`
          // window.open(`${process.env.BASE_URL}pdf/web/viewer.html?file=${encodeURIComponent(url)}`)
        })
      },
    }
  }
</script>
<style lang="scss" scoped>
  .pdf-box{
    height: 100%;
  }
  iframe{
    border-width: 0;
  }
</style>
